<template>
	<view class="container">
		<view class="xuanfuanniu" @click="dianji">
			+
		</view>
		<view class="xuanfuanniu2" @click="tohome">
			回到首页
		</view>
		<view class="head">
			<view class="img">
				<image :src="data.img" mode="widthFix"></image>
			</view>
			<view class="contain">
				<view class="name">
					{{data.name}}
				</view>
				<view class="contain2">
					<view class="author">
						作者：{{data.author}}
					</view>
					<view class="fenlei">
						分类：{{data.category}}
					</view>
					<view class="tags">
						标签：{{data.tags}}
					</view>
					<view class="wordnum">
						字数：5000万
					</view>
				</view>
			</view>
		</view>
		<view class="jianjie">
			<view class="title">
				简介：
			</view>
			<view class="contain">
				{{data.contain}}
			</view>
		</view>
		<view class="zhangjie">
			<view class="title">
				章节：
			</view>
			<view class="contain">
				<view class="item" v-for="(item, index) in zhangjie" :key="index" @click="toneirong(item)">
					<text class="zhangjienum">{{item.zhangjienum}}: </text>
					<text class="titles"> {{item.title}}</text>
				</view>
			</view>
		</view>

	</view>
</template>


<script>
	export default {
		data() {
			return {
				data: {},
				zhangjie: []
			}
		},
		//参数command
		//0 参数的传入获取，同时小说列表请求网络
		//1 参数的传入获取，小说列表本地
		//2 参数本地，小说网络
		//3 参数本地，小说本地
		//仅实现0和3
		//参数a：携带小说大概的数据
		onLoad: function(options) {
			console.log(options);
			console.log(options.command);
			if (options.command == '3') { //本地+本地
				// options有值时执行的操作
				console.log(888);
				let novelDatasss = uni.getStorageSync('novelDatasss');
				this.data = novelDatasss;
				
				let zhangjieliebiao = uni.getStorageSync('zhangjie')
				this.zhangjie =zhangjieliebiao;
				console.log(this.zhangjie);
			} else if (options.command == '0') //输入+网络
			{
				// options有值时执行的操作
				console.log(123);
				var a = JSON.parse(decodeURIComponent(options.a));
				console.log("展示小说的大概信息：");
				console.log(a); // 输出变量a的JSON数据
				uni.setStorageSync('novelDatasss', a);
				this.data = a;
				let that = this
				uniCloud.callFunction({
					name: 'get_novel_zhangjieliebiao',
					data: that.data
				}).then(res => {
					console.log("展示章节列表：");
					console.log(res.result.data);
					that.zhangjie = res.result.data;
					uni.setStorageSync('zhangjie', res.result.data); // 将e数据保存到名为novelData的本地缓存中
				})
			} else { //刷新默认章节本地，列表网络请求，就是2  //本地+网络
				let novelDatasss = uni.getStorageSync('novelDatasss');
				this.data = novelDatasss;
				let that = this
				uniCloud.callFunction({
					name: 'get_novel_zhangjieliebiao',
					data: that.data
				}).then(res => {
					console.log("展示章节列表：");
					console.log(res.result.data);
					that.zhangjie = res.result.data;
					uni.setStorageSync('zhangjie', res.result.data); // 将e数据保存到名为novelData的本地缓存中
				})
			}








		},
		methods: {
			toneirong(e) {
				console.log(e);
				let a = e;
				a.name = this.data.name;
				// let e = this.data.name;
				uni.navigateTo({
					//url: '/pages/shijianxiangxi/shijianxiangxi',
					url: '/pages/novel_contant_show/novel_contant_show?command=0&a=' + encodeURIComponent(JSON
						.stringify(e))
				});
			},
			dianji() {
				let e = this.data.name;
				uni.navigateTo({
					//url: '/pages/shijianxiangxi/shijianxiangxi',
					url: '/pages/write_novel/write_novel?novelname=' + e
				});
			},
			tohome() {
				uni.switchTab({
					url: '/pages/home/home'
				});
			}
		}
	}
</script>
<style scoped lang="scss">
	.container {
		background-color: palegoldenrod;
		padding-top: 20px;
		padding-left: 10px;

		.head {
			display: flex;

			height: 200px;
			padding-bottom: 10px;
			border-bottom: 1px dashed #000;
			.img {
				width: 40%;
				background-color: saddlebrown;
				border-radius: 10px;
				overflow: hidden;
				display: flex;
				align-items: center;

				image {
					width: 100%;
				}
			}

			.contain {
				width: 60%;

				.name {
					font-family: "楷体", KaiTi, serif;
					font-weight: 800;
					padding: 30px 0px 0px 20px;
					font-size: 20px;
				}

				.contain2 {
					padding: 10px 20px;
					line-height: 30px;
				}
			}

		}

		.jianjie {
			border-bottom: 1px dashed #000;
			padding: 20px 10px;

			.title {
				font-size: 18px;
			}

			.contain {
				margin-top: 20px;
				text-indent: 56rpx;

			}
		}

		.zhangjie {
			padding: 20px 10px;

			.title {
				font-size: 18px;
			}

			.contain {
				margin-top: 10px;

				.item {
					color: blue;

					margin-top: 5px;

					.zhangjienum {
						text-decoration: underline;
					}

					.titles {
						margin-left: 10px;
						font-family: "楷体", KaiTi, serif;
						font-size: 18px;
					}
				}
			}
		}
	}

	.xuanfuanniu {
		height: 50px;
		width: 50px;
		font-size: 25px;
		color: #fff;
		background-color: #23DA36;
		text-align: center;
		line-height: 50px;
		position: fixed;
		bottom: 100px;
		right: 50px;
		z-index: 1500;
		border-radius: 50%;
	}

	.xuanfuanniu2 {
		font-size: 15px;
		color: red;
		text-align: center;
		line-height: 50px;
		position: fixed;
		bottom: 50px;
		right: 45px;
		text-decoration: underline;
		z-index: 1500;
		border-radius: 50%;
	}
</style>